<template>
  <div>
    <!-- 底部导航开始 -->
    <div>
      <tabbar>
        <tabbar-item v-link="{name:'index'}">
          <img slot="icon" src="../assets/bank.png">
          <span slot="label">首页</span>
        </tabbar-item>
        <tabbar-item show-dot>
          <img slot="icon" src="../assets/diamond.png">
          <span slot="label">商品</span>
        </tabbar-item>
        <tabbar-item selected>
          <img slot="icon" src="../assets/truck.png">
          <span slot="label">订单</span>
        </tabbar-item>
        <tabbar-item>
          <img slot="icon" src="../assets/user.png">
          <span slot="label">我的</span>
        </tabbar-item>
      </tabbar>
    </div>
    <!-- 底部导航结束 -->
  </div>
</template>

<style lang="less">
  .weui_tabbar_item.weui_bar_item_on .weui_tabbar_label { color: #888;}
</style>

<script>
  import Vue from 'vue';
  import VueRouter from 'vue-router';

  Vue.use(VueRouter);
  const router = new VueRouter();

  import {Tabbar, TabbarItem} from 'vux';
  export default {
    components: {
      Tabbar,
      TabbarItem,
    },
  };
</script>